@charset "utf-8";
/* CSS Document */
@font-face
{
    font-family: myFont;
    src: url('segoeuisl.ttf'),
        url('segoeui.eot');
}

#lean_overlay {
    position: fixed;
    z-index:100;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
    background: #000;
    display: none;
}

root { 
    display: block;
}

.textfield {
	width: 170px;
	border: 1px solid #999;
	border-radius: 5px;
}

maincontent {
	background-color:#FFF;
    height: 400px;
	width: 910px;
}
.inside {
    width:950px;
    margin:auto;
}

.header {
    height:120px;
    position:relative;
}


.header a {
    float:right;
    padding-top: 55px;
    padding-right: 150px;
    color:#113F8C;
    font-size:20px;
    text-decoration:none;
    text-align:right;
    text-shadow: 0.5px 1px 0px #E9F2F9,
               1px 1.5px 0px #c9c9c9,
               1.5px 2px 0px #B2D1E5,
               2px 2.5px 0px #b9b9b9,
               2.5px 3px 0px #B2D1E5;
    font-weight:bold;
}

.header a span{
    font-size:12px;
}

.header a img {
    position: absolute;
    top: 30px;
    right: 30px;
    vertical-align:top;
    z-index: 2;
    height: 110px;
    width: 110px;
}
.header span.congthongtin {
    font-size: 16px;
}

.title {
	height: 200px;
	width: 500px;
	margin-top: 100px;
	padding-top: 30px;
	color: darkblue;
	font-family: Georgia, "Times New Roman", Times, serif;
}

.title h1 {
	font-size: 22px;
	text-align: right;
}

.title h2 {
	font-size: 16px;
	text-align: right;
}

.title img {
	float: right;
	height: 80px;
	width: 80px;
}

form#frmlogin {
	width: 200px;
	padding: 5px;
	border-radius: 5px;
	border: 1px solid #999;
	float:right;
}

.btn_search {
	position: relative;
	right: -70px;
	width: 100px;
	height: 30px;
	border: 1px solid #999;
	border-radius: 5px;
	-moz-border-radius: 5px;
}

.login{
	width: 750px;
	margin: auto;
	position: relative;
}
nav {
    background-color:#3C8DC5;
    height:60px;
    border-bottom:solid 0px #FFF;
    -webkit-box-shadow: 0px 0px 10px rgba(17, 63, 140,0.9);
    -moz-box-shadow:    0px 0px 10px rgba(17, 63, 140,0.9);
    box-shadow:         0px 0px 10px rgba(17, 63, 140,0.9);
    background-image: linear-gradient(bottom,#00638D 0%,#348DCE 94%);
    background-image: -o-linear-gradient(bottom,#00638D 0%,#348DCE 94%);
    background-image: -moz-linear-gradient(bottom,#00638D 0%,#348DCE 94%);
    background-image: -webkit-linear-gradient(bottom,#00638D 0%,#368FCF 94%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0,#00638D),color-stop(0.94,#348DCE));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#368FCF, endColorstr=#00638D)";
}
.nav {
    height:100%;   
}

.nav ul {
    list-style:none;	
}

.nav ul#topnav {
    background-color:#3C8DC5;
    background-image: linear-gradient(bottom,#00638D 0%,#348DCE 94%);
    background-image: -o-linear-gradient(bottom,#00638D 0%,#348DCE 94%);
    background-image: -moz-linear-gradient(bottom,#00638D 0%,#348DCE 94%);
    background-image: -webkit-linear-gradient(bottom,#00638D 0%,#368FCF 94%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0,#00638D),color-stop(0.94,#348DCE));
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#348DCE, endColorstr=#00638D)";
    height:100%;
    font-weight: 700;
}

.nav ul#topnav li{
    float:left;
    width:16%;
    padding:0px;
    height:100%;
}

.nav ul#topnav li a {
    display:block;
    color:#FFF;
    text-decoration:none;
    text-align:center;
    vertical-align: middle;
    height:102%;
}

.nav ul#topnav li a:hover {
    background-color:#ef7901;
}

.nav ul#topnav li a:active {
    background-color:#ef7901;
}



.nav ul#topnav li a span {
    font-weight:500;
}

.nav ul#topnav li a img {
    padding-top: 6px;
    height: 26px;
    width: 26px;
}

.main-content{
    background-clip: content-box;
    border: 8px solid #000; 
    width: 950px;
    margin : 20px auto auto auto;
    padding: 8px;	
    border: rgba(0,255,255, 0.3);
    -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.8);
    -moz-box-shadow:    0px 0px 8px rgba(0,0,0,0.8);
    box-shadow:         0px 0px 8px rgba(0,0,0,0.8);
}

maincontent {
    background-color:#FFF;
    padding:20px;
    display:table;	
    width: 910px;
    margin : auto;
}

maincontent div#right-bar hr {
    margin: 0px 15px 5px 15px;
    border-top: solid 1px #CCCCCC;
    border-left: solid 1px #CCCCCC;
    border-right: solid 1px #CCCCCC;
    border-bottom:solid 1px #FFFFFF;	
}



maincontent div#right-bar p{
    margin: 15px 10px 5px 15px;
    color: #113F8C;
    font-size:12px;
    font-weight:bold;
}

maincontent div#right-bar a {
    margin: 0px 15px 0px 15px;
    text-decoration:none;
    color: #113F8C;
}

maincontent div#right-bar div.row:hover{
    background-color:#3B5998;	    
    color: #FFFFFF; 
}

maincontent div#right-bar a:hover {
    text-decoration:underline;
    color: #FFFFFF;
}

maincontent div#right-bar div.row {
    padding: 5px 10px 8px 20px;
}

maincontent div#right-bar form {
    display:inline;
}

maincontent div#right-bar input#search-textbox {
    height:29px;
    width:170px;
    border:solid 1px #B7B7B7;
    margin:10px 0px 10px 20px;
}

maincontent div#right-bar input#search-button {
    margin-left: 5px;
    height:31px;
    width:31px;
    background-color:#FFFFFF;
    border: solid 1px #B7B7B7;
    background-image:url(../images/search.png);
    background-repeat:no-repeat;
}

maincontent div#right-bar input#search-button:hover {
    background-color:#3B5998;
}
maincontent div#right-bar {
    margin:10px 20px 10px -60px;
    float: left;
    width:250px;    
    background-color: #EDEFF4;
    background-clip: content-box;
    border: 8px solid #207AC0; 
    padding: 8px;    
    color: #FFFFFF;
    border:rgba(255,255,255, 0.5);
    -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.9);
    -moz-box-shadow:    0px 0px 8px rgba(0,0,0,0.9);
    box-shadow:         0px 0px 8px rgba(0,0,0,0.9);
    display: table;
}
body {
	font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
	font-size: 12px;
	background-color: #5C5C5C;
	/* fallback */
	background-color: #2F2727;
	background-image: url(images/radial_bg.png);
	background-position: center center;
	background-repeat: no-repeat;
	/* Safari 4-5, Chrome 1-9 */
	/* Can't specify a percentage size? Laaaaaame. */
	background: -webkit-gradient(radial, center center, 0, center center, 460, from(#1a82f7
		), to(#CCC));
	/* Safari 5.1+, Chrome 10+ */
	background: -webkit-radial-gradient(circle, #CCC, #FFF);
	/* Firefox 3.6+ */
	background: -moz-radial-gradient(circle, #1a82f7, #2F2727);
	/* IE 10 */
	background: -ms-radial-gradient(circle, #1a82f7, #2F2727);

	/* Opera couldn't do radial gradients, then at some point they started supporting the -webkit- syntax, how it kinda does but it's kinda broken (doesn't do sizing) */
}

line div#one {
	background-color: #cdf061;
}

line div {
	margin-top: 30px;
	width: 20%;
	height: 5px;
	float: left;
}

line div#two {
	background-color: #dd6d6d;
}

line div#three {
	background-color: #51d072;
}

line div#four {
	background-color: #e361ff;
}

line div#five {
	background-color: #ffc34e;
}

footer {
	margin-top: 30px;
	height: 160px;
	padding-bottom: 0px;
	margin-bottom: 0px;
	background-color: #003366;
	-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
	-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.8);
	background-image: linear-gradient(bottom, #113F8C 30%, #003366 70%);
	background-image: -o-linear-gradient(bottom, #113F8C 30%, #003366 70%);
	background-image: -moz-linear-gradient(bottom, #113F8C 30%, #003366 70%);
	background-image: -webkit-linear-gradient(bottom, #113F8C 30%, #003366 70%);
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.3, #113F8C),
		color-stop(0.7, #003366));
}

footer div {
	position: relative;
}

footer div.inside div#footer-link {
	width: 200px;
	position: absolute;
	top: 20px;
	right: 20px;
	border-left: solid 1px #A0A0A4;
	padding-left: 20px;
}

footer div.inside div#footer-link a {
	text-decoration: none;
	color: #A0A0A4;
}

footer div.inside div#footer-link a:hover {
	text-decoration: none;
	color: #808080;
}

footer div.inside div#footer-link a:active {
	text-decoration: none;
	color: #808080;
}

footer div.inside p {
	padding-top: 40px;
	color: #FFF;
}

footer div.inside p span {
	color: #808080;
}

input#button:hover {
    cursor: pointer;	
}

input#textbox{
    height: 25px;
    background-color:#f5f5f5;
    border: solid 1px #B7B7B7;	
    padding: 0px 5px 0px 5px;
}

input#button{
    height:25px;
    border: solid 1px #3B6E22;
    background-color:#6FAA55;
    color:#FFF;
    padding: 0px 20px 0px 20px;    
    -webkit-box-shadow: 1px 1px 3px rgba(17, 63, 140,0.8);
    -moz-box-shadow:    1px 1px 3px rgba(17, 63, 140,0.8);
    box-shadow:         1px 1px 3px rgba(17, 63, 140,0.8);
    background-image: linear-gradient(bottom,#3B6E22 0%,#6FAA55 84%);
    background-image: -o-linear-gradient(bottom,#3B6E22 0%,#6FAA55 84%);
    background-image: -moz-linear-gradient(bottom,#3B6E22 0%,#6FAA55 84%);
    background-image: -webkit-linear-gradient(bottom,#3B6E22 0%,#6FAA55 84%);
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0,#3B6E22),color-stop(0.84,#6FAA55));
    font-weight: bold;
}


.site-map-path {
    display: block;
    width: 100%;
    vertical-align: middle;
    height: 30px;
    margin-bottom: 10px;
}

.site-map-path img {
    margin-bottom: -2px;
}

.site-map-path label {
    color: #3B5998;
}

.site-map-path a {
    color: #3B5998;
    text-decoration: none;    
}

.site-map-path .focus {
    font-weight: bold;
}

.site-map-path hr {
    font-weight: bold;
}

.line-header-padding {
    margin-top: 3px;
    margin-bottom: 10px;
    background-color: black;
    height: 1px;
}

.content div{    
    display:table; 
    float: left;
    width:610px;
}

.content div#public{	    
    display: table;
    background-color:#E9F2F9;
    border-left:solid 18px #3B5998;
    border-bottom: 2px solid #3B5998;
    border-right: 2px solid #3B5998;
    border-top: 2px solid #3B5998;
    padding: 10px 20px 10px 20px;
    margin-top: 20px;
}

.content div#public div#row {
    height: 25px;
    margin-top: 5px;
}

.content div#private div#row {
    height: 25px;
    margin-top: 5px;
}

.tbox {position:absolute; display:none; padding:14px 17px; z-index:900}
.tinner {padding:15px; -moz-border-radius:5px; border-radius:5px; background:#fff url(images/preload.gif) no-repeat 50% 50%; border-right:1px solid #333; border-bottom:1px solid #333}
.tmask {position:absolute; display:none; top:0px; left:0px; height:100%; width:100%; background:#000; z-index:800}
.tclose {position:absolute; top:0px; right:0px; width:30px; height:30px; cursor:pointer; background:url(images/close.png) no-repeat}
.tclose:hover {background-position:0 -30px}

#error {background:#ff6969; color:#fff; text-shadow:1px 1px #cf5454; border-right:1px solid #000; border-bottom:1px solid #000; padding:0}
#error .tcontent {padding:10px 14px 11px; border:1px solid #ffb8b8; -moz-border-radius:5px; border-radius:5px}
#success {background:#2ea125; color:#fff; text-shadow:1px 1px #1b6116; border-right:1px solid #000; border-bottom:1px solid #000; padding:10; -moz-border-radius:0; border-radius:0}
#bluemask {background:#4195aa}
#frameless {padding:0}
#frameless .tclose {left:6px}